<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="json" uri="http://www.atg.com/taglibs/json" %>  

<!doctype html>
<html lang="zh-hans">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="lib/bootstrap/css/bootstrap.min.css">

<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/main.css">    
<script src="lib/jquery-2.1.1.min.js"></script>
<script src="lib/bootstrap/js/bootstrap.min.js"></script>
<title>HIFO</title>
<!-- 省市区 -->
<script type="text/javascript">
var j={
  "clientBase": {
    "name": "刘德华",
    "state": null,
    "owner": 1,
    "creator": 1,
    "comName": "达到顶峰",
    "cid": 57,
    "areaId": "undefined",
    "cityId": "510100",
    "modified": 1450331899000,
    "created": 1450331899000,
    "originId": 0,
    "provinceId": "110000",
    "modifier": null,
    "isRemind": null
  },
  "clientExtend": {
    "id": {
      "creator": 1,
      "cid": 57
    },
    "owner": 1,
    "memo": null,
    "modified": 1450331899000,
    "created": 1450331899000,
    "clientType": 0,
    "gjTimeType": 3,
    "isZan": 0,
    "yywjj": "斗山",
    "yyzzj": "成工",
    "ygsbType": "装载机",
    "sellPlan": null
  },
  "cityName": null,
  "areaName": null,
  "sellPlanRate": 0,
  "clientPhones": null
};



function select1() {
$.ajax(
{
    type: "post",
    url: "getProvince",
    data: { "provinceCode": j.clientBase.provinceId },
    success: function (msg) {
        for (var i = 0; i < msg.length; i++) {
            $("#S1").append("<option value='" +msg[i].provinceId+ "'>" + msg[i].province + "</option>");
        }
        select2();
        
    }
})
};

function select2() {
$("#S2").html("");
$.ajax(
{
    type: "post",
    url: "getCity",
    data: {"code":$('#S1').val(),"cityCode":j.clientBase.cityId},
    success: function (msg) {
        for (var i = 0; i < msg.length; i++) {
            $("#S2").append("<option value=" + msg[i].cityId + ">" + msg[i].city + "</option>");
        }
        select3();
    }
})
};
        
function select3() {
$("#S3").html("");
$.ajax(
{
    type: "post",
    url: "getArea",
    data: { "code":$('#S2').val(),"areaCode":j.clientBase.areaId},
    success: function (msg) {
        for (var i = 0; i < msg.length; i++) {
            $("#S3").append("<option value=" + msg[i].areaID + ">" + msg[i].area+ "</option>");
        }
    }
})
};


$(function () {
select1();
$('#S1').bind("change", select2);
$('#S2').bind("change", select3);
});




var j_client=<%=request.getAttribute("json_clientDetail")%>;

</script>
</head>
<body>
<%@ include file="_daohang.jsp" %>	
<form name="form1" action="kh_add" method ="post">
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingOne">
<h5 class="panel-title">
<a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
基本信息
</a>
</h5>
</div>
<div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
<div class="panel-body khdetail">
           
<!-- #################基本信息 START ###################         -->
<!--隐藏表单域 用来存放client ID -->
<div class="form"><input type="text" class="form-control" id="exampleInputAmount" value="<s:property value="cid"/>"></div>

<div class="form-group">  
<div class="input-group">
<div class="input-group-addon"><img class="home" src="images/phone.png"></div>

<input name="phone1" type="text" class="form-control" id="exampleInputAmount" placeholder="电话" value="<%=request.getAttribute("phone1")==null?"":request.getAttribute("phone1")%>">
<div class="input-group-addon"><img class="home" src="images/add.png"></div>
</div>


<div class="input-group hide"> <!--后面的电话2初始隐藏 重复START-->
<div class="input-group-addon"><img class="home" src="images/phone.png"></div>
<input name="phone2" type="text" class="form-control" id="exampleInputAmount" placeholder="电话" value="<%=request.getAttribute("phone2")==null?"":request.getAttribute("phone2")%>">
<div class="input-group-addon"><img class="home" src="images/trash03.png"></div>
</div>                    <!--后面的电话初始隐藏 重复END-->

<div class="input-group hide"> <!--后面的电话3初始隐藏 重复START-->
<div class="input-group-addon"><img class="home" src="images/phone.png"></div>
<input name="phone3" type="text" class="form-control" id="exampleInputAmount" placeholder="电话" value="<%=request.getAttribute("phone3")==null?"":request.getAttribute("phone3")%>">
<div class="input-group-addon"><img class="home" src="images/trash03.png"></div>
</div>                    <!--后面的电话初始隐藏 重复END-->

<div class="input-group">
<div class="input-group-addon"><img class="home" src="images/name.png"></div>
<input name="name" type="text" class="form-control" id="exampleInputAmount" placeholder="姓名" value="<%=request.getAttribute("name")==null?"":request.getAttribute("name")%>">
</div>

<div class="input-group">
<div class="input-group-addon"><img class="home" src="images/company.png"></div>
<input name="comName" type="text" class="form-control" id="exampleInputAmount" placeholder="公司名称" value="<%=request.getAttribute("comName")==null?"":request.getAttribute("comName")%>">
</div>        
    
<div class="input-group">
<div class="input-group-addon">省&nbsp;</div>
<select id="S1" name="provinceCode" class="form-control">

</select>
<!--<div class="input-group-addon"><img class="home" src="images/zanwei.png"></div>-->
</div>
    
<div class="input-group">
<div class="input-group-addon">市&nbsp;</div>
<select id="S2" name="cityCode" class="form-control">

</select>
<!--<div class="input-group-addon"><img class="home" src="images/busy.png"></div>-->
</div>
    
<div class="input-group">
<div class="input-group-addon">区&nbsp;</div>
<select id="S3" name="areaCode" class="form-control">

</select>
<!--<div class="input-group-addon"><img class="home" src="images/no.png"></div>-->
</div>
    
    
<div class="input-group">
<div class="input-group-addon"><img class="home" src="images/memo.png"></div>
<textarea name="memo" class="form-control" rows="2" cols="10"><%=request.getAttribute("memo")==null?"":request.getAttribute("memo")%> </textarea>
<!--<div class="input-group-addon"><img class="home" src="images/yes.png"></div>-->
</div>
  
</div><!--form-group-->
<!-- ################基本信息 END   ###########################       -->           
           
           
           
           
           
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="headingTwo">
<h4 class="panel-title">
<a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
扩展信息
</a>
</h4>
</div>
<div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
<div class="panel-body khdetail">


<!-- 扩展信息 START   #####################   -->


<!--挖掘机品牌--><div><hr>现有挖机品牌</div>
<div class="form-group">
<s:checkboxlist name="chose1" list="{'卡特','小松','日立','斗山','现代','沃尔沃','神钢','其他'}" value="#request.chose1"/> <br/>
</div>

<!--装载机品牌--><div><hr>现有装机品牌</div>
<div class="form-group">
<s:checkboxlist name="chose2" list="{'柳工','临工','成工','龙工','厦工','山工','其他'}" value="#request.chose2"/> <br/>
</div>

<!--欲购设备类型--><div><hr>欲购设备类型</div>		
<div class="form-group">
<s:checkboxlist name="chose3" list="{'挖掘机','装载机','其他'}" value="#request.chose3"/> <br/>
</div>

<!--客户类型--><div><hr>客户分类</div>
<div class="container"><div class="row">
<div class="col-xs-4"><label><input type="radio" name="chose4"  value="0">无<span class="fuhao">&frasl;</span></label></div>
<div class="col-xs-4"><label><input type="radio" name="chose4"  value="1">作废<span class="fuhao">&chi;</span></label></div>
<div class="col-xs-4"><label><input type="radio" name="chose4"  value="2">标记<span class="fuhao">&clubs;</span></label></div>
<div class="col-xs-4"><label><input type="radio" name="chose4"  value="3">一般<span class="fuhao">&diams;</span></label></div>
<div class="col-xs-4"><label><input type="radio" name="chose4"  value="4">重要<span class="fuhao">&spades;</span></label></div>
</div></div><!--row--container-->

<!--给赞--><div><hr>经纪人给赞</div>
<div class="container"><div class="row">
<div class="col-xs-4"><label><input type="radio" name="chose5" id="op2" value="0">无<span class="fuhao">&frasl;</span></label></div>
<div class="col-xs-4"><label><input type="radio" name="chose5" id="op2" value="1"><span class="fuhao zan">&hearts;</span></label></div>
<!--<div class="col-xs-4"><label><input type="radio" name="ops2" id="op2" value="2"><img class="home" src="images/dan.png"></label></div>-->
</div></div><!--row--container-->


<!--欲购时间--><div><hr>预计购机时间</div>
<div class="container"><div class="row">
<div class="col-xs-12">预计达成销售时间为：2015/03/12</div>
    <select id="form43" name="chose6">
    <option value="0">---</option>
    <option value="1">一月内</option>
    <option value="2">二月内</option>
    <option value="3">三月内</option>
    <option value="4">四月内</option>
    <option value="5">五月内</option>
    <option value="6">半年内</option>
    <option value="7">一年内</option>
    </select>
</div></div><!--row--container-->



<!--  扩展信息 END    ####################  -->

</div></div>

<div class="container navbar-fixed-bottom">
<div class="row">
<!--<div class="col-xs-4"><button type="button" class="btn btn-success">新建</button></div>-->
<div class="col-xs-4"></div>
<!--<div class="col-xs-4"><button type="button" class="btn btn-success">暂存</button></div>-->
<div class="col-xs-8">
    <button type="button" class="btn btn-info center-block" data-toggle="modal" data-target="#myModal">提交</button>
</div>
</div>
</div>

</div></div>   				
				
<!-- 按钮触发模态框 START-->    
<!--
<div class="container navbar-fixed-bottom">
<button type="button" class="btn btn-info center-block" data-toggle="modal" data-target="#myModal">提交</button>
</div>
-->
<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" 
aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<!--<h4 class="modal-title" id="myModalLabel">确认修改</h4>-->
</div>
<!--此处可以加入很多信息-->
<div class="modal-body">
    <input type="button" class="btn btn-primary" value="确定提交"  onClick="javascript:document.form1.submit()"  />
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>

</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<script>
$(function () { $('#myModal').modal({
keyboard: false;
})});
</script>
<!--按钮触发模态框 END -->

</form>				

</body>
</html>